<!--积分商城-->
<template>
	<div>
		<Swiper></Swiper>
		<div class="wrap">
			<div v-for='a in fruit' class="Market">		
				<div class="Market_one">
						<p>{{a.title}}</p>
						<p class="count">{{a.count}}</p>
					<p>
						<span class="score">{{a.score}}</span>
						<span>{{a.price}}</span>
					</p>
					<button>立即兑换</button>
				</div>				
			</div>		
		</div>
	</div>
</template>

<script>
	import Swiper from '../Swiper.vue'
	export default{
		name:'Market',
		components:{
			Swiper
		},
		data:function(){
			return {
				fruit:[{
					img:require("../../assets/image/0126.png"),title:'新西兰佳沛黄金奇异果',count:' 花蜜般的甘甜百吃不厌',score:'积分:500',price:'价值:¥20.0'
				},{
					title:'新西兰佳沛黄金奇异果',count:' 花蜜般的甘甜百吃不厌',score:'积分:500',price:'价值:¥20.0'
				},{
					title:'新西兰佳沛黄金奇异果',count:' 花蜜般的甘甜百吃不厌',score:'积分:500',price:'价值:¥20.0'
				},{
					title:'新西兰佳沛黄金奇异果',count:' 花蜜般的甘甜百吃不厌',score:'积分:500',price:'价值:¥20.0'
				},{
					title:'新西兰佳沛黄金奇异果',count:' 花蜜般的甘甜百吃不厌',score:'积分:500',price:'价值:¥20.0'
				},{
					title:'新西兰佳沛黄金奇异果',count:' 花蜜般的甘甜百吃不厌',score:'积分:500',price:'价值:¥20.0'
				},{
					title:'新西兰佳沛黄金奇异果',count:' 花蜜般的甘甜百吃不厌',score:'积分:500',price:'价值:¥20.0'
				},{
					title:'新西兰佳沛黄金奇异果',count:' 花蜜般的甘甜百吃不厌',score:'积分:500',price:'价值:¥20.0'
				}]
			}
		}
	}
</script>

<style scoped>
	.wrap{
		width: 1280px;
		margin:20px auto;
	}
	.Market{
		width: 320px;
		display: inline-block;
	}
	.Market p{
		text-align: center;
	}
	.Market_one p:nth-child(1){
		padding-top: 310px;
	}
	.Market_one{
		background: url(../../assets/image/0124.png) no-repeat;
		margin-top: 20px;
	}
	.Market_one button{
		width: 150px;
		height: 36px;
		background: #F08200;
		border-radius:5px ;
		color: white;
		margin-left:92px ;
	}
	.score{
		color: red;
		margin-right: 10px;
	}
	.count{
		font-size: 14px;
		color: darkgray;
	}
</style>